<template>
  <h1>一个人的信息</h1>
  <h2>姓名：{{name}}</h2>
  <h2>年龄：{{age}}</h2>
  <h2>职位：{{job.type}}</h2>
  <h2>月薪：{{job.salary}}</h2>
  <button @click="changeInfo">修改人的信息</button>
</template>
<script>
import {ref} from 'vue'
export default {
  name: 'App',
  setup(){
    let name = ref('张三')
    let age = ref(18)
    let job = ref({
      type:'中级前端工程师',
      salary:'30k'
    })
    function changeInfo(){
      //name.value='李四'
      //age.value=39
      //job.value.type="数据分析师"
      //job.value.salary="40k"
      console.log(job.value)
    }
    return{
      name, age, job, changeInfo
    }
    //返回一个渲染函数（标签名，标签体信息）
    //return ()=> h('h1',"尚硅谷")
  }
}
</script>

<style>

</style>
